<!DOCTYPE html>
<html>
  <!-- meta/link... -->
  



<head>
  <meta http-equiv="content-type" content="text/html; charset=utf-8">
  <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport">
  <!-- Global site tag (gtag.js) - Google Analytics -->


  <title>symkmk123</title>

  <link rel="icon" type="image/x-icon, image/vnd.microsoft.icon" href="/favicon.ico">
  <link rel="stylesheet" href="https://at.alicdn.com/t/font_1911880_c1nvbyezg17.css">
  <link href="https://cdn.jsdelivr.net/gh/inkss/fontawesome@5.15.3/css/all.min.css" rel="stylesheet">

  
    <script>
        var themeModelId = '';
        if (themeModelId) {
            localStorage.setItem('modelId', themeModelId);
        }
    </script>
    
    <script src="https://cdn.jsdelivr.net/gh/yuang01/live2d-widget@latest/autoload.js"></script>
    <script>
        var live2dOpen = eval('true') || false;
        if (!live2dOpen) {
            localStorage.setItem('waifu-display', 1609323474481);
        }
    </script>
  
  
  
<link rel="stylesheet" href="/css/animate.min.css">

  
<link rel="stylesheet" href="/css/style.css">

  
  
    
<link rel="stylesheet" href="/js/fancybox/jquery.fancybox.min.css">

  
  
  <style>
        @media (max-width: 992px) {
            #waifu {
                display: none;
            }
        }
    </style>
    <script src="//cdn.bootcss.com/pace/1.0.2/pace.min.js"></script>
    <link href="//cdn.bootcss.com/pace/1.0.2/themes/pink/pace-theme-flash.css" rel="stylesheet">

    

    <!-- import link -->
    
        
            
        
            
        
    
    <!-- import script -->
    
        
            
        
            
        
    

<meta name="generator" content="Hexo 5.4.0"></head>

  
  <!-- 依赖于jquery和vue -->
  <script src="/js/jquery3.5.1.js"></script>
  <script src="/js/vue2.6.11.js"></script>
  
  <body>
    <!-- 预加载动画 -->
    <!-- 页面预加载动画 -->

<div id='loader'>
  <link rel="stylesheet" href="/js/loaded/index.css" >
  <div class="loading-left-bg"></div>
  <div class="loading-right-bg"></div>
  <div class="spinner-box">
    <div class="configure-border-1">
      <div class="configure-core"></div>
    </div>
    <div class="configure-border-2">
      <div class="configure-core"></div>
    </div>
    <div class="loading-word">加载中...</div>
  </div>
</div>

<script>
  var endLoading = function () {
    document.body.style.overflow = 'auto';
    document.getElementById('loader').classList.add("loading");
  }
  window.addEventListener('DOMContentLoaded',endLoading);
  
</script>

    
    <!-- 判断是否为暗黑风格 -->
    <!-- 判断是否为黑夜模式 -->
<script>
  let isDark = JSON.parse(localStorage.getItem('dark')) || JSON.parse('false');

  if (isDark) {
    $(document.body).addClass('darkModel');
  }
</script>

    <!-- 头部导航等 -->
    
<header class="header " id="navHeader"
  style="position: fixed;
  left: 0; top: 0; z-index: 10;width: 100%;"
>
  <div class="header-content">
    <div class="bars">
      <div id="appDrawer" class="sidebar-image">
  <div class="drawer-box-icon">
    <i class="fas fa-bars" aria-hidden="true" @click="showDialogDrawer"></i>
  </div>
  
  <transition name="fade">
    <div class="drawer-box_mask" v-cloak style="display: none;" v-show="visible" @click.self="cancelDialogDrawer">
    </div>
  </transition>
  <div class="drawer-box" :class="{'active': visible}">
    <div class="drawer-box-head bg-color">
      <img class="drawer-box-head_logo lazyload placeholder" src="/medias/logo.png" class="lazyload placeholder" data-srcset="/medias/logo.png" srcset="https://img2.baidu.com/it/u=2037979560,2772131037&fm=26&fmt=auto&gp=0.jpg" alt="logo">
      <h3 class="drawer-box-head_title">symkmk123</h3>
      <h5 class="drawer-box-head_desc"></h5>
    </div>
    
    <div class="drawer-box-content">
      <ul class="drawer-box-content_menu">
        
          
            <li class="drawer-box-content_item" style="position: relative;">
              
                <a href="/" class="drawer-menu-item-link">
                  
                    <i class="fa fa-home" aria-hidden="true"></i>
                  
                  <span class="name">首页</span>
                </a>
              
            </li>
          
            <li class="drawer-box-content_item" style="position: relative;">
              
                <a href="/archives" class="drawer-menu-item-link">
                  
                    <i class="fa fa-archive" aria-hidden="true"></i>
                  
                  <span class="name">归档</span>
                </a>
              
            </li>
          
            <li class="drawer-box-content_item" style="position: relative;">
              
                <a href="/tags" class="drawer-menu-item-link">
                  
                    <i class="fa fa-tags" aria-hidden="true"></i>
                  
                  <span class="name">标签</span>
                </a>
              
            </li>
          
            <li class="drawer-box-content_item" style="position: relative;">
              
                <a href="/categories" class="drawer-menu-item-link">
                  
                    <i class="fa fa-bookmark" aria-hidden="true"></i>
                  
                  <span class="name">分类</span>
                </a>
              
            </li>
          
            <li class="drawer-box-content_item" style="position: relative;">
              
                <a href="/about" class="drawer-menu-item-link">
                  
                    <i class="fa fa-user" aria-hidden="true"></i>
                  
                  <span class="name">关于</span>
                </a>
              
            </li>
          
        
        
          <li class="drawer-box-content_item">
            <a target="_blank" rel="noopener" href="https://gitee.com/symkmk123">
              <i class="fas fa-github" aria-hidden="true"></i>
              <span>Github</span>
            </a>
          </li>
        
      </ul>
    </div>
  </div>
</div>

<script>
  var body = document.body || document.documentElement || window;
  var vm = new Vue({
    el: '#appDrawer',
    data: {
      visible: false,
      top: 0,
      openArr: [],
    },
    computed: {
    },
    mounted() {
    },
    methods: {
      isOpen(index) {
        if (this.openArr.includes(index)) {
          return true;
        } else {
          return false;
        }
      },
      openOrCloseMenu(curIndex) {
        const index = this.openArr.indexOf(curIndex);
        if (index !== -1) {
          this.openArr.splice(index, 1);
        } else {
          this.openArr.push(curIndex);
        }
      },
      showDialogDrawer() {
        this.visible = true;
        // 防止页面滚动，只能让弹框滚动
        this.top = $(document).scrollTop()
        body.style.cssText = 'width: 100%; height: 100%;overflow: hidden;';
      },
      cancelDialogDrawer() {
        this.visible = false;
        body.removeAttribute('style');
        $(document).scrollTop(this.top)
      }
    },
    created() {}
  })
</script>

    </div>
    <div class="blog-title" id="author-avatar">
      
        <div class="avatar">
          <img src="/medias/logo.png" class="lazyload placeholder" data-srcset="/medias/logo.png" srcset="https://img2.baidu.com/it/u=2037979560,2772131037&fm=26&fmt=auto&gp=0.jpg" alt="logo">
        </div>
      
      <a href="/" class="logo">symkmk123</a>
    </div>
    <nav class="navbar">
      <ul class="menu">
        
          
            <li class="menu-item" style="position: relative;">
              
                <a href="/" class="menu-item-link" title="首页">
                  
                    <i class="fa fa-home" aria-hidden="true"></i>
                  
                  <span class="name">首页</span>
                </a>
              
            </li>
          
            <li class="menu-item" style="position: relative;">
              
                <a href="/archives" class="menu-item-link" title="归档">
                  
                    <i class="fa fa-archive" aria-hidden="true"></i>
                  
                  <span class="name">归档</span>
                </a>
              
            </li>
          
            <li class="menu-item" style="position: relative;">
              
                <a href="/tags" class="menu-item-link" title="标签">
                  
                    <i class="fa fa-tags" aria-hidden="true"></i>
                  
                  <span class="name">标签</span>
                </a>
              
            </li>
          
            <li class="menu-item" style="position: relative;">
              
                <a href="/categories" class="menu-item-link" title="分类">
                  
                    <i class="fa fa-bookmark" aria-hidden="true"></i>
                  
                  <span class="name">分类</span>
                </a>
              
            </li>
          
            <li class="menu-item" style="position: relative;">
              
                <a href="/about" class="menu-item-link" title="关于">
                  
                    <i class="fa fa-user" aria-hidden="true"></i>
                  
                  <span class="name">关于</span>
                </a>
              
            </li>
          
        
      </ul>
      
      
        <div id="appSearch">
  <div class="search"  @click="showDialog()"><i class="fas fa-search" aria-hidden="true"></i></div>
  <transition name="fade">
    <div class="message-box_wrapper" style="display: none;" v-cloak v-show="dialogVisible" @click.self="cancelDialogVisible()">
      <div class="message-box animated bounceInDown">
        <h2>
          <span>
            <i class="fas fa-search" aria-hidden="true"></i>
            <span class="title">本地搜索</span>
          </span>
          <i class="fas fa-times close" pointer style="float:right;" aria-hidden="true" @click.self="cancelDialogVisible()"></i>
        </h2>
        <form class="site-search-form">
          <input type="text"
            placeholder="请输入关键字"
            id="local-search-input" 
            @click="getSearchFile()"
            class="st-search-input"
            v-model="searchInput"
          />
        </form>
        <div class="result-wrapper">
          <div id="local-search-result" class="local-search-result-cls"></div>
        </div>
      </div>
    </div>
  </transition>
</div>
<script src="/js/local_search.js"></script>
<script>
  var body = document.body || document.documentElement || window;
  var vm = new Vue({
    el: '#appSearch',
    data: {
      dialogVisible: false,
      searchInput: '',
      top: 0,
    },
    computed: {
    },
    mounted() {
      window.addEventListener('pjax:complete', () => {
        this.cancelDialogVisible();
      })
    },
    methods: {
      showDialog() {
        this.dialogVisible = true;
        // 防止页面滚动，只能让弹框滚动
        this.top = $(document).scrollTop()
        body.style.cssText = 'overflow: hidden;';
      },
      getSearchFile() {
        if (!this.searchInput) {
          getSearchFile("/search.xml");
        }
      },
      cancelDialogVisible() {
        this.dialogVisible = false;
        body.removeAttribute('style');
        $(document).scrollTop(this.top)
      },
    },
    created() {}
  })
</script>
<!-- 解决刷新页面闪烁问题，可以在元素上添加display: none, 或者用vue.extend方法，详情：https://blog.csdn.net/qq_31393401/article/details/81017912 -->
<!-- 下面是搜索基本写法 -->
<!-- <script type="text/javascript" id="local.search.active">
  var inputArea = document.querySelector("#local-search-input");
  inputArea.onclick   = function(){ getSearchFile(); this.onclick = null }
  inputArea.onkeydown = function(){ if(event.keyCode == 13) return false }
</script> -->

      

    </nav>
  </div>
  
    <a target="_blank" rel="noopener" href="https://gitee.com/symkmk123" class="github-corner color-primary" aria-label="View source on GitHub"><svg width="60" height="60" viewBox="0 0 250 250" style="fill:#fff; position: absolute; top: 0; border: 0; right: 0;" aria-hidden="true"><path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path><path d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2" fill="currentColor" style="transform-origin: 130px 106px;" class="octo-arm"></path><path d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z" fill="currentColor" class="octo-body"></path></svg></a><style>.github-corner:hover .octo-arm{animation:octocat-wave 560ms ease-in-out}@keyframes octocat-wave{0%,100%{transform:rotate(0)}20%,60%{transform:rotate(-25deg)}40%,80%{transform:rotate(10deg)}}@media (max-width:500px){.github-corner:hover .octo-arm{animation:none}.github-corner .octo-arm{animation:octocat-wave 560ms ease-in-out}}</style>
  
  

    <!-- 当头部导航设置为背景透明的时候  -->
    
      <script src="/js/header/index.js" data-pjax></script>
    
</header>

    <!-- 需要在上面加载的js -->
    <script>
  function loadScript(src, cb) {
    return new Promise(resolve => {
      setTimeout(function () {
        var HEAD = document.getElementsByTagName("head")[0] || document.documentElement;
        var script = document.createElement("script");
        script.setAttribute("type", "text/javascript");
        if (cb) {
          if (JSON.stringify(cb)) {
            for (let p in cb) {
              if (p == "onload") {
                script[p] = () => {
                  cb[p]()
                  resolve()
                }
              } else {
                script[p] = cb[p]
                script.onload = resolve
              }
            }
          } else {
            script.onload = () => {
              cb()
              resolve()
            };
          }
        } else {
          script.onload = resolve
        }
        script.setAttribute("src", src);
        HEAD.appendChild(script);
      });
    });
  }

  //https://github.com/filamentgroup/loadCSS
  var loadCSS = function (href, before, media, attributes) {
    return new Promise(resolve => {
      setTimeout(function () {
        var link = document.createElement('link');
        link.rel = "stylesheet";
        link.href = src;
        link.onload = resolve;
        document.getElementsByTagName("head")[0].appendChild(link);
      });
    });
  };

</script> 

<!-- 轮播图所需要的js -->
<script src="/js/swiper/swiper.min.js"></script>
<script src="/js/swiper/vue-awesome-swiper.js"></script>
<script src="/js/swiper/swiper.animate1.0.3.min.js"></script>


  <script src="/js/vue-typed-js/index.js"></script>


<!-- 首页的公告滚动插件的js需要重新加载 -->
<script src="/js/vue-seamless-scroll/index.js"></script>

<!-- 打字机效果js -->
<script src="https://cdn.jsdelivr.net/npm/typed.js@2.0.11"></script>


    <!-- 内容区域 -->
    <div id="safearea">
      <main class="main" id="pjax-container" style="margin-top: 0;">
        <!-- 首页轮播 -->
<link href="/js/swiper/swiper@5.4.1.min.css" rel="stylesheet">


  <link href="/js/vue-typed-js/index.css" rel="stylesheet">






<div class="swiper-length" style="display: none;">0</div>
<div id="appSwiper"
  class="swiper-no-swiping"
  @mouseenter="stopAutoPlay()" 
  @mouseleave="startAutoPlay()"
>
  <swiper v-cloak ref="mySwiper" :options="swiperOptions" @slideChangeTransitionEnd="slideChangeTransitionEnd">
    
      <swiper-slide>
        <div class="item swiper-lazy" data-background="https://img11.360buyimg.com/ddimg/jfs/t1/160978/33/20686/2476596/6083e62dEa588862b/63f8f2163ab61b2f.png" style="background-size: 300000px; 
          background-position: left center;" style="position: relative;">
          <div class="swiper-bgmask" style="position: absolute;top: 0;left: 0;width: 100%;height: 100%;"></div>
            <div class="flag">
              
              <div class="img-mask swiper-lazy swiper-default-bgImg" data-background="https://img11.360buyimg.com/ddimg/jfs/t1/160978/33/20686/2476596/6083e62dEa588862b/63f8f2163ab61b2f.png" style="height: 100%; background-size: cover; 
                background-position: center center;">
                <div class="swiper-lazy-preloader swiper-lazy-preloader-white"></div>   
              </div>
              <div class="flag-text">
                <div class="flag-text-content">
                  <div class="title ani animated" swiper-animate-effect="fadeInDown" swiper-animate-duration="0.2s" swiper-animate-delay="0.1s">青墨书晚风</div>
                  
                      <div class="excerpt ani animated" swiper-animate-effect="fadeInDown" swiper-animate-duration="0.2s" swiper-animate-delay="0.1s"></div>
                    
                </div>
                <div style="display: flex;" class="flag-text-btns">
                  
                  
                </div>
              </div>
            </div>
          </div>
      </swiper-slide>
    
  </swiper>
  
    <div id="scroll-down" @click="toPostContent()">
      <a href="javascript:;">
        <i class="fas fa-angle-down scroll-down-effects"></i>
      </a>
    </div>
  
  <canvas id="header_canvas"style="position:absolute;bottom:0;width:100%;pointer-events:none;"></canvas>
</div>

<script type="text/javascript">
  Vue.use(window.VueAwesomeSwiper)
</script>

<script>
  var autoplay = JSON.parse('false');
  var delay = '5000';
  var loop = JSON.parse('true') ? false : JSON.parse('true');
  var effect = 'slide';
  var swiperLength = parseInt(document.querySelector(".swiper-length").innerText);
  var defaultDesc = '';
  defaultDesc = defaultDesc.split(',');
  var defaultDescTypedLoop = JSON.parse('true');
  var vm = new Vue({
    el: '#appSwiper',
    data: {
      defaultDesc: defaultDesc,
      defaultDescTypedLoop,
      swiperOptions: {
        pagination: {
          el: '.swiper-pagination',
          clickable: true // 允许点击小圆点跳转
        },
        loop: loop ? true : false,
        effect, // fade
        autoplay: (autoplay && swiperLength > 1) ? {
  　　　　delay,
  　　　　disableOnInteraction: false // 手动切换之后继续自动轮播
    　　} : false,
        navigation: {
          nextEl: '.swiper-button-next',
          prevEl: '.swiper-button-prev',
        },
        lazy: {
          loadPrevNext: true,
        },
        on:{
          init: function() {
            swiperAnimateCache(this); //隐藏动画元素 
            swiperAnimate(this); //初始化完成开始动画
          }, 
          slideChangeTransitionEnd: function(){ 
            swiperAnimate(this); //每个slide切换结束时也运行当前slide动画
          } 
        }
        // Some Swiper option/callback...
      }
    },
    computed: {
      swiper() {
        return this.$refs.mySwiper.$swiper
      }
    },
    mounted() {
      // console.log('Current Swiper instance object', this.swiper)
      // this.swiper.slideTo(0, 1000, false)
    },
    methods: {
      stopAutoPlay() {
        (autoplay && swiperLength > 1) && this.swiper.autoplay.stop();
      },
      startAutoPlay() {
        (autoplay && swiperLength > 1) && this.swiper.autoplay.start();
      },
      slideChangeTransitionEnd() {
        console.log('1');
      },
      toPostContent() {
        const fullHeight = $(window).height() - 60;
        $('html,body').animate({scrollTop: fullHeight},500);
      }
    },
    created() {}
  })
</script>

  <script src="/js/bubble/homeBubble.js"></script>

<style>
#appSwiper {
  position: relative;
  user-select: none;
  overflow: hidden;
}
.default-excerpt {
  font-size: 1.6rem;
  margin-top: 1rem;
  font-family: Titillium Web,'PingFang SC','Hiragino Sans GB','Microsoft JhengHei','Microsoft YaHei',sans-serif;
}
.bottom-one-btn {
  margin-top: 15px;
}
.swiper-container {
  overflow: hidden;
  z-index: 0;
}
.swiper-slide {
  height: 350px;
  position: relative;
}
.swiper-button-prev,
.swiper-button-next {
  padding: 10px 10px;
  transition: background 0.2s;
}
.swiper-button-prev:hover,
.swiper-button-next:hover {
  background: rgba(0, 0, 0, 0.2);
}
.swiper-slide .item {
  width: 100%;
  height: 100%;
}
.flag {
  position: relative;
  width: 70%;
  margin: 0 auto;
  color: #ffffff;
  height: 100%;
  background: #000;
}
.flag img {
  min-height: 100%;
}
.flag-text {
  position: absolute;
  top: 50px;
  left: 50px;
  width: 80%;
  height: 280px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  z-index: 9999;
}
.flag-text .title {
  font-size: 1.8rem;
  font-family: Long Cang,cursive;
}
.flag-text .title a {
  color: #fff;
  transition: color 0.3s;
}
.flag-text .title a:hover {
  color: #42b983;
}
.flag-text .excerpt {
  color: #eee;
  font-family: Ubuntu,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;
  width: 70%;
  line-height: 30px;
  height: 150px;
  margin-top: 2%;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 5;
  overflow: hidden;
}
.swiper-pagination-bullet-active {
  opacity: 1;
  background-color: #42b983;
}
.img-mask {
  opacity:0.6; filter: alpha(opacity=60);
}
.flag-text .read-more {
  margin-bottom: 30px;
  padding: 5px 15px;
  color: #ffffff;
  border-radius: 20px;
}
#scroll-down {
  position: absolute;
  bottom: 10px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 2.5rem;
  color: #fff;
  cursor: pointer;
  z-index: 2;
}
#scroll-down a {
  color: #fff;
}
@-webkit-keyframes rightan
  {
  
  0%
  {
    transform: translateY(0);
    opacity: 0.5;
  }
  50% {
    transform: translateY(-30px);
    opacity: 1;
  }
  100%
  {
    transform: translateY(0);
    opacity: 0.5;
  }
}
.scroll-down-effects {
  animation: rightan 1.5s infinite;
}
/* 当头部导航设置为背景透明的时候 */

  .swiper-slide {
    height: 400px;
  }
  .flag-text {
    top: 80px;
  }


@media (min-width: 992px) {
  .swiper-button-prev {
    margin-left: 15%;
    transform: translateX(-180%);
  }
  .swiper-button-next {
    margin-right: 15%;
    transform: translateX(180%);
  }
  .flag-text .title {
    width: 80%;
    line-height: 35px;
    max-height: 70px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
  }
}
@media screen and (max-width: 1200px) { 
  .flag {
    width: 80%;
  }
  .swiper-button-prev {
    margin-left: 10%;
    transform: translateX(-180%);
  }
  .swiper-button-next {
    margin-right: 10%;
    transform: translateX(180%);
  }
}
@media (max-width: 992px) {
  .flag {
    width: 100%;
  }
  .flag-text .title {
    font-size: 1.5rem;
    margin-top: 50px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
  }
  .flag-text {
    position: absolute;
    top: 0;
    left: 0;
    width: 80%;
    height: 100%;
    margin-left: 50%;
    transform: translateX(-50%);
  }
  .flag-text .excerpt {
    width: 100%;
    line-height: 25px;
    height: 125px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 5;
    overflow: hidden;
  }
  .flag-text .read-more {
    margin-bottom: 80px;
  }
}
@media (max-width: 992px) and (min-width: 551px) {
  .flag-text .excerpt {
    width: 70%;
  }
}
@media (max-width: 551px) {
  .swiper-slide {
    height: 250px;
  }
  .flag-text .title {
    line-height: 30px;
    max-height: 60px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    margin-top: 20px;
  }
  .flag-text .excerpt {
    font-size: 1rem;
    line-height: 20px;
    height: 80px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
  }
  .flag-text .excerpt { 
    margin-top: 10px;
  }
  .flag-text .read-more {
    margin-top: 10px;
    margin-bottom: 50px;
  }
  .swiper-button-prev,
  .swiper-button-next {
    transform: scale(0.5);
  }
  .swiper-button-prev {
    left: 0;
  }
  .swiper-button-next {
    right: 0;
  }
}
/* 当头部导航设置为背景透明的时候 */

  @media (max-width: 992px) {
    .flag-text {
      top: 60px;
      height: 80%;
    }
  }
  @media (max-width: 551px) {
    .swiper-slide {
      height: 310px;
    }
  }


/* 文字或者按钮居中显示 */

  .flag-text {
    left: 10%;
  }
  .flag-text .flag-text-content {
    width: 100%;
    text-align: center;
  }
  .flag-text .title {
    width: 100%;
    text-align: center;
  }
  .flag-text .excerpt { 
    width: 100%;
    text-align: center;
  }
  .bottom-one-btn {
    display: flex;
    justify-content: center;
  }
  .default-excerpt {
    display: flex;
    justify-content: center;
    font-size: 1.6rem;
    font-family: Titillium Web,'PingFang SC','Hiragino Sans GB','Microsoft JhengHei','Microsoft YaHei',sans-serif;
  }
  .flag-text-btns {
    justify-content: center;
  }
  @media (min-width: 992px) {
    .flag-text .excerpt {
      line-height: 30px;
      display: -webkit-box;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 5;
      overflow: hidden;
    }
  }
  @media (max-width: 992px) {
    .flag-text {
      margin-left: 0;
      transform: translateX(0);
    }
  }




/* 全屏显示 */

  .flag {
    width: 100%;
  }
  .swiper-slide {
    height: calc(100vh - 60px);
    
      height: 100vh;
    
  }
  .flag-text {
    top: 50%;
    left: 15%;
    transform: translateY(-50%);
    width: 70%;
    height: auto;
  }
  .flag-text .title {
    font-size: 2.8rem;
    line-height: 1.5em;
    max-height: none;
    /* overflow: visible; */
  }
  .flag-text .excerpt {
    font-size: 1.25rem;
    height: 150px;
  }
  .flag-text .read-more {
    margin-top: 10px;
  }
  .swiper-button-prev,
  .swiper-button-next {
    margin-top: -60px!important;
  }
  .swiper-btn-color,
  .swiper-btn-color2 {
    background-color: transparent;
    border: 1px solid #fff;
  }
  .swiper-btn-color:hover,
  .swiper-btn-color2:hover {
    background-color: #42b983;
    border: 1px solid #42b983!important;
  }
  .flag-text-btns {
    justify-content: center;
  }
  .swiper-button-prev {
    margin-left: 10px;
    transform: translateX(0);
    border-radius: 50%;
    padding: 0;
    width: 50px;
    height: 50px;
  }
  .swiper-button-next {
    margin-right: 10px;
    transform: translateX(0);
    border-radius: 50%;
    padding: 0;
    width: 50px;
    height: 50px;
  }
  .swiper-button-next:after, .swiper-button-prev:after {
    font-size: 1.2rem;
  }
  @media (min-width: 992px) {
    .flag-text .excerpt {
      line-height: 35px;
      height: 175px;
    }
    .default-excerpt {
      min-height: 150px;
    }
    .typed-element {
      align-items: unset;
    }
  }
  @media (max-width: 992px) {
    .flag-text {
      margin-left: 0;
      height: 60%;
      top: 55%;
    }
    .flag-text .title {
      font-size: 2.4rem;
      margin-top: 0;
      display: -webkit-box;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 2;
      overflow: hidden;
    }
    .flag-text .excerpt {
      line-height: 35px;
      height: 185px;
    }
    .flag-text .read-more {
      margin-top: 20px;
    }
  }
  @media (max-width: 551px) {
    .flag-text {
      height: 60%;
    }
    .flag-text .title {
      font-size: 2.2rem;
    }
    .flag-text .excerpt {
      line-height: 30px;
    }
    .flag-text .read-more {
      margin-top: 50px;
      padding: 10px 30px;
    }
    .swiper-button-prev {
      margin-left: 0;
    }
    .swiper-button-next {
      margin-right: 0;
    }
    .default-excerpt {
      margin-top: 1rem;
    }
  }


/* video */
.swiper-video {
  width: 100%;
  height: 100%;
}
.swiper-video video {
  pointer-events: none;
}
.swiper-video-maskBox{
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-color: #000;
  opacity: 0.2;
  z-index: 1;
}
@media (min-width: 992px) {
  
    .swiper-video {
      display: none;
    }
    .swiper-default-bgImg {
      display: block;  
    }
  
}
@media (max-width: 992px) {
  .swiper-video {
    display: none;
  }
  .swiper-default-bgImg {
    display: block;  
  }
}
/* video-end */
</style>
<div id="l_main">
  <div class="l_content">
    <!-- 自定义的内容 -->
    
    <!-- 首页座右铭 -->
    
  <div class="motto">
      <h3 class="motto-title">座右铭</h3>
      <div class="motto-content">
        <p>
          沉淀后我愿意做个温暖的人，有自己的喜好，有自己的原则，有自己的信仰，不急功近利，不浮夸轻薄。宠辱不惊，淡定安逸，心静如水，不忘初心，方得始终。——凌茜  
        </p> 
      </div>
  </div>

    <!-- 首页公告 -->
    
<style>
  .index-notice-content {
    margin-top: 10px;
  }
  .warp {
    width: 100%;
    margin: 0 auto;
    overflow: hidden;
  }
  .index-notice-content__ul {
    list-style: none;
    padding: 0;
    margin: 0 auto;
  }
  .index-notice-content__ul li,
  .index-notice-content__ul a {
    display: block;
    height: 30px;
    line-height: 30px;
    display: flex;
    justify-content: space-between;
    font-size: 15px;
  }
  .index-notice-content__title {
    flex: 1;
    overflow: hidden;
  }
  .index-notice-content__title a,
  .index-notice-content__title span {
    overflow: hidden;
    display: block;
    text-overflow:ellipsis; 
    white-space: nowrap;
    height: 100%;
    width: 100%;
    color: #000;
  }
  .index-notice-content__title a:hover,
  .index-notice-content__title span:hover {
    text-decoration: underline;
  }
  .index-notice-content__date {
    min-width: 80px;
    margin-left: 5px;
    color: #000;
  }
</style>
<div class="index-notice" id="appIndexNotice">
    <h3>
      <i class="fas fa-bullhorn index-notice-icon"></i>公告
    </h3>
    <div class="index-notice-content">
      
      <vue-seamless-scroll
        :data="listData"
        :class-option="classOption"
        class="warp"
        style="height: 0px"
      >
        <ul class="index-notice-content__ul">
          
           
        </ul>
      </vue-seamless-scroll>
    </div>
</div>
<script src="/js/vue-seamless-scroll/index.js"></script>

<!-- 滚动插件采用 vue-seamless-scroll
  https://chenxuan0000.github.io/vue-seamless-scroll/zh/guide/06-singleStop.html 
-->

<script>
  var seamless = JSON.parse('false');
  seamless = seamless ? 0 : 30;
  var listData = '' || '';
  listData = listData.split(',');
  var vm = new Vue({
    el: '#appIndexNotice',
    data: {
      listData: listData,
      moveNum: 2,
      classOption: {
        singleHeight: seamless,
        limitMoveNum: listData.length
      },
    },
    computed: {
    },
    mounted() {
    },
    methods: {
    },
    created() {
      this.moveNum = parseInt(this.listData.length);
    }
  })
</script>



    <!-- 首页文章置顶 -->
    


<div class="topArticle reveal">
	<h3><i class="fas fa-thumbs-o-up" aria-hidden="true"></i>推荐文章</h3>
	<div class="articles">
		
			
				<div class="article-link">
					
					<div class="article" style="background-size: cover; 
						background-position: center center;">
						<img class="lazyload lazyload placeholder" src="/medias/1.jpg" class="lazyload placeholder" data-srcset="/medias/1.jpg" srcset="https://img2.baidu.com/it/u=2037979560,2772131037&fm=26&fmt=auto&gp=0.jpg" alt="">
					</div>
					<div class="text">
						<div class="text-main">
							<div class="title"><a href="/2022/02/14/Elasticsearch%E4%B8%ADScript%E7%94%A8%E6%B3%95%E4%BB%A3%E6%9B%BFsql%E4%B8%ADa%E5%B0%8F%E4%BA%8Eb%E6%9D%A1%E4%BB%B6/">Elasticsearch中Script用法代替sql中a小于b条件</a></div>
							<div class="content">
								Elasticsearch中Script用法代替sql中a小于b条件如果real_follow_time为空，判断条件为
							</div>
						</div>
						<a href="/2022/02/14/Elasticsearch%E4%B8%ADScript%E7%94%A8%E6%B3%95%E4%BB%A3%E6%9B%BFsql%E4%B8%ADa%E5%B0%8F%E4%BA%8Eb%E6%9D%A1%E4%BB%B6/" class="more">
							<i class="fas fa-eye" aria-hidden="true"></i>阅读更多
						</a>
					</div>
				</div>
			
		
			
				<div class="article-link">
					
					<div class="article" style="background-size: cover; 
						background-position: center center;">
						<img class="lazyload lazyload placeholder" src="/medias/10.jpg" class="lazyload placeholder" data-srcset="/medias/10.jpg" srcset="https://img2.baidu.com/it/u=2037979560,2772131037&fm=26&fmt=auto&gp=0.jpg" alt="">
					</div>
					<div class="text">
						<div class="text-main">
							<div class="title"><a href="/2022/02/14/java%E5%A4%9A%E7%BA%BF%E7%A8%8B%E5%8A%A0%E9%80%9F%E9%81%8D%E5%8E%86%E8%A7%A3%E6%9E%90/">java多线程加速遍历解析</a></div>
							<div class="content">
								原始需求导出医生记录
//按照患者id分组，组内按照就诊时间升序

上面是耗时久的代码，每次导出一万五百条数据大概需要五
							</div>
						</div>
						<a href="/2022/02/14/java%E5%A4%9A%E7%BA%BF%E7%A8%8B%E5%8A%A0%E9%80%9F%E9%81%8D%E5%8E%86%E8%A7%A3%E6%9E%90/" class="more">
							<i class="fas fa-eye" aria-hidden="true"></i>阅读更多
						</a>
					</div>
				</div>
			
		
			
		
			
		
			
				<div class="article-link">
					
					<div class="article" style="background-size: cover; 
						background-position: center center;">
						<img class="lazyload lazyload placeholder" src="/medias/10.jpg" class="lazyload placeholder" data-srcset="/medias/10.jpg" srcset="https://img2.baidu.com/it/u=2037979560,2772131037&fm=26&fmt=auto&gp=0.jpg" alt="">
					</div>
					<div class="text">
						<div class="text-main">
							<div class="title"><a href="/2021/05/21/hbase/">Hbase介绍及操作</a></div>
							<div class="content">
								1. Hbase概述1.1 Hbase是什么
HBase是建立在HDFS之上的分布式面向列的数据库；属于KV结构数据，原
							</div>
						</div>
						<a href="/2021/05/21/hbase/" class="more">
							<i class="fas fa-eye" aria-hidden="true"></i>阅读更多
						</a>
					</div>
				</div>
			
		
			
		
			
		
			
				<div class="article-link">
					
					<div class="article" style="background-size: cover; 
						background-position: center center;">
						<img class="lazyload lazyload placeholder" src="/medias/13.jpg" class="lazyload placeholder" data-srcset="/medias/13.jpg" srcset="https://img2.baidu.com/it/u=2037979560,2772131037&fm=26&fmt=auto&gp=0.jpg" alt="">
					</div>
					<div class="text">
						<div class="text-main">
							<div class="title"><a href="/2021/05/21/%E9%80%9A%E7%94%A8%E5%AF%BC%E5%85%A5/">通用导入</a></div>
							<div class="content">
								数据导入功能支持
读取excel、CSV
加入自定义注解校验数据防重
加入导入值跟实体类的类型检查
字典表支持(跟导出一
							</div>
						</div>
						<a href="/2021/05/21/%E9%80%9A%E7%94%A8%E5%AF%BC%E5%85%A5/" class="more">
							<i class="fas fa-eye" aria-hidden="true"></i>阅读更多
						</a>
					</div>
				</div>
			
		
			
		
	</div>
</div>


    <div class="bg-floor" id="home-bg-floor" style="position: fixed;left: 0;top: 0;width: 100%;height: 100%;z-index: -2;"></div>
    <!-- 每一篇文章卡片 -->
    <!-- hash算法 -->

<section class="posts">
  
    
    <article class="post reveal" style="flex-direction: row-reverse;   ">
      <div class="post-main">
        <div class="post-info">
          <div class="post-time">
            <i class="fas fa-clock" aria-hidden="true"></i>
            <span class="post-time">2022-02-14</span>
          </div>
          <div class="post-title">
            <a class="post-title-link" href="/2022/02/14/Elasticsearch%E4%B8%ADScript%E7%94%A8%E6%B3%95%E4%BB%A3%E6%9B%BFsql%E4%B8%ADa%E5%B0%8F%E4%BA%8Eb%E6%9D%A1%E4%BB%B6/">Elasticsearch中Script用法代替sql中a小于b条件</a>
          </div>
          <div class="post-meta">
            <div class="post-tags">
              <!-- 文章详情页的标签 -->

    <i class="iconfont icontag"></i>
    <ul class="article-tag-list" itemprop="keywords"><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/Elasticsearch/" rel="tag">Elasticsearch</a></li></ul>

            </div>
            <div class="post-categories">
              <!-- 文章详情页的分类 -->

<div class="article-category">
  <i class="iconfont iconbookmark1"></i>
  <a class="article-category-link" href="/categories/Elasticsearch/">Elasticsearch</a>
</div>


            </div>
          </div>
          <div class="post-img-mobile">
            <a href="/2022/02/14/Elasticsearch%E4%B8%ADScript%E7%94%A8%E6%B3%95%E4%BB%A3%E6%9B%BFsql%E4%B8%ADa%E5%B0%8F%E4%BA%8Eb%E6%9D%A1%E4%BB%B6/" style="background-size: cover; 
              background-position: center center;">
              <img class="lazyload lazyload placeholder" src="/medias/1.jpg" class="lazyload placeholder" data-srcset="/medias/1.jpg" srcset="https://img2.baidu.com/it/u=2037979560,2772131037&fm=26&fmt=auto&gp=0.jpg" alt="">
            </a>
          </div>
          <div class="post-content">
            Elasticsearch中Script用法代替sql中a小于b条件如果real_follow_time为空，判断条件为real_follow_time比预定follow_up_time时间加40天大，
如果real_follow_time
          </div>
        </div>
        <div class="post-more">
          <a href="/2022/02/14/Elasticsearch%E4%B8%ADScript%E7%94%A8%E6%B3%95%E4%BB%A3%E6%9B%BFsql%E4%B8%ADa%E5%B0%8F%E4%BA%8Eb%E6%9D%A1%E4%BB%B6/">
            <i class="iconfont iconmore" pointer style="float: right;  " title="阅读更多"></i>
          </a>
        </div>
      </div>
      <div class="post-img">
        <a href="/2022/02/14/Elasticsearch%E4%B8%ADScript%E7%94%A8%E6%B3%95%E4%BB%A3%E6%9B%BFsql%E4%B8%ADa%E5%B0%8F%E4%BA%8Eb%E6%9D%A1%E4%BB%B6/" style="background-size: cover; 
          background-position: center center;">
          <img class="lazyload lazyload placeholder" src="/medias/1.jpg" class="lazyload placeholder" data-srcset="/medias/1.jpg" srcset="https://img2.baidu.com/it/u=2037979560,2772131037&fm=26&fmt=auto&gp=0.jpg" alt="">
        </a>
      </div>
    </article>
  
    
    <article class="post reveal" style="   ">
      <div class="post-main">
        <div class="post-info">
          <div class="post-time">
            <i class="fas fa-clock" aria-hidden="true"></i>
            <span class="post-time">2022-02-14</span>
          </div>
          <div class="post-title">
            <a class="post-title-link" href="/2022/02/14/java%E5%A4%9A%E7%BA%BF%E7%A8%8B%E5%8A%A0%E9%80%9F%E9%81%8D%E5%8E%86%E8%A7%A3%E6%9E%90/">java多线程加速遍历解析</a>
          </div>
          <div class="post-meta">
            <div class="post-tags">
              <!-- 文章详情页的标签 -->

    <i class="iconfont icontag"></i>
    <ul class="article-tag-list" itemprop="keywords"><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/CompletableFuture/" rel="tag">CompletableFuture</a></li><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/CountDownLatch/" rel="tag">CountDownLatch</a></li><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/%E5%A4%9A%E7%BA%BF%E7%A8%8B/" rel="tag">多线程</a></li></ul>

            </div>
            <div class="post-categories">
              <!-- 文章详情页的分类 -->

<div class="article-category">
  <i class="iconfont iconbookmark1"></i>
  <a class="article-category-link" href="/categories/%E5%A4%9A%E7%BA%BF%E7%A8%8B/">多线程</a>
</div>


            </div>
          </div>
          <div class="post-img-mobile">
            <a href="/2022/02/14/java%E5%A4%9A%E7%BA%BF%E7%A8%8B%E5%8A%A0%E9%80%9F%E9%81%8D%E5%8E%86%E8%A7%A3%E6%9E%90/" style="background-size: cover; 
              background-position: center center;">
              <img class="lazyload lazyload placeholder" src="/medias/10.jpg" class="lazyload placeholder" data-srcset="/medias/10.jpg" srcset="https://img2.baidu.com/it/u=2037979560,2772131037&fm=26&fmt=auto&gp=0.jpg" alt="">
            </a>
          </div>
          <div class="post-content">
            原始需求导出医生记录
//按照患者id分组，组内按照就诊时间升序

上面是耗时久的代码，每次导出一万五百条数据大概需要五六分钟才出结果，其中es里存的是json格式的数据，每次还需要解析。
初步优化初步优化思路是：将json插入的时候就解析
          </div>
        </div>
        <div class="post-more">
          <a href="/2022/02/14/java%E5%A4%9A%E7%BA%BF%E7%A8%8B%E5%8A%A0%E9%80%9F%E9%81%8D%E5%8E%86%E8%A7%A3%E6%9E%90/">
            <i class="iconfont iconmore" pointer style="  " title="阅读更多"></i>
          </a>
        </div>
      </div>
      <div class="post-img">
        <a href="/2022/02/14/java%E5%A4%9A%E7%BA%BF%E7%A8%8B%E5%8A%A0%E9%80%9F%E9%81%8D%E5%8E%86%E8%A7%A3%E6%9E%90/" style="background-size: cover; 
          background-position: center center;">
          <img class="lazyload lazyload placeholder" src="/medias/10.jpg" class="lazyload placeholder" data-srcset="/medias/10.jpg" srcset="https://img2.baidu.com/it/u=2037979560,2772131037&fm=26&fmt=auto&gp=0.jpg" alt="">
        </a>
      </div>
    </article>
  
    
    <article class="post reveal" style="flex-direction: row-reverse;   ">
      <div class="post-main">
        <div class="post-info">
          <div class="post-time">
            <i class="fas fa-clock" aria-hidden="true"></i>
            <span class="post-time">2021-10-20</span>
          </div>
          <div class="post-title">
            <a class="post-title-link" href="/2021/10/20/02redis%E5%88%86%E5%B8%83%E5%BC%8F%E9%94%81%E5%88%86%E6%9E%90%E4%B8%8Ecluster%E6%A8%A1%E5%BC%8F%E6%90%AD%E5%BB%BA/">02redis分布式锁分析与cluster模式搭建</a>
          </div>
          <div class="post-meta">
            <div class="post-tags">
              <!-- 文章详情页的标签 -->

    <i class="iconfont icontag"></i>
    <ul class="article-tag-list" itemprop="keywords"><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/redis/" rel="tag">redis</a></li><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/%E5%88%86%E5%B8%83%E5%BC%8F%E9%94%81/" rel="tag">分布式锁</a></li></ul>

            </div>
            <div class="post-categories">
              <!-- 文章详情页的分类 -->

<div class="article-category">
  <i class="iconfont iconbookmark1"></i>
  <a class="article-category-link" href="/categories/redis/">redis</a>
</div>


            </div>
          </div>
          <div class="post-img-mobile">
            <a href="/2021/10/20/02redis%E5%88%86%E5%B8%83%E5%BC%8F%E9%94%81%E5%88%86%E6%9E%90%E4%B8%8Ecluster%E6%A8%A1%E5%BC%8F%E6%90%AD%E5%BB%BA/" style="background-size: cover; 
              background-position: center center;">
              <img class="lazyload lazyload placeholder" src="/medias/11.jpg" class="lazyload placeholder" data-srcset="/medias/11.jpg" srcset="https://img2.baidu.com/it/u=2037979560,2772131037&fm=26&fmt=auto&gp=0.jpg" alt="">
            </a>
          </div>
          <div class="post-content">
            1.redis分布式锁的问题
第一种方案，基于redis单实例，不靠谱，因为redis单点故障，会导致系统全盘崩溃，做不到高可用，除非你是那种不太核心的小系统，随便用一下分布式锁，你可以这么弄，应该还好，毕竟对高可用要求没那么高

第二种方
          </div>
        </div>
        <div class="post-more">
          <a href="/2021/10/20/02redis%E5%88%86%E5%B8%83%E5%BC%8F%E9%94%81%E5%88%86%E6%9E%90%E4%B8%8Ecluster%E6%A8%A1%E5%BC%8F%E6%90%AD%E5%BB%BA/">
            <i class="iconfont iconmore" pointer style="float: right;  " title="阅读更多"></i>
          </a>
        </div>
      </div>
      <div class="post-img">
        <a href="/2021/10/20/02redis%E5%88%86%E5%B8%83%E5%BC%8F%E9%94%81%E5%88%86%E6%9E%90%E4%B8%8Ecluster%E6%A8%A1%E5%BC%8F%E6%90%AD%E5%BB%BA/" style="background-size: cover; 
          background-position: center center;">
          <img class="lazyload lazyload placeholder" src="/medias/11.jpg" class="lazyload placeholder" data-srcset="/medias/11.jpg" srcset="https://img2.baidu.com/it/u=2037979560,2772131037&fm=26&fmt=auto&gp=0.jpg" alt="">
        </a>
      </div>
    </article>
  
    
    <article class="post reveal" style="   ">
      <div class="post-main">
        <div class="post-info">
          <div class="post-time">
            <i class="fas fa-clock" aria-hidden="true"></i>
            <span class="post-time">2021-10-20</span>
          </div>
          <div class="post-title">
            <a class="post-title-link" href="/2021/10/20/01redis%E5%92%8Czk%E9%94%81%E7%9A%84%E5%AE%9E%E7%8E%B0%E5%8E%9F%E7%90%86/">01redis和zk锁的实现原理</a>
          </div>
          <div class="post-meta">
            <div class="post-tags">
              <!-- 文章详情页的标签 -->

    <i class="iconfont icontag"></i>
    <ul class="article-tag-list" itemprop="keywords"><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/%E5%88%86%E5%B8%83%E5%BC%8F%E9%94%81/" rel="tag">分布式锁</a></li></ul>

            </div>
            <div class="post-categories">
              <!-- 文章详情页的分类 -->

<div class="article-category">
  <i class="iconfont iconbookmark1"></i>
  <a class="article-category-link" href="/categories/%E5%88%86%E5%B8%83%E5%BC%8F%E9%94%81/">分布式锁</a>
</div>


            </div>
          </div>
          <div class="post-img-mobile">
            <a href="/2021/10/20/01redis%E5%92%8Czk%E9%94%81%E7%9A%84%E5%AE%9E%E7%8E%B0%E5%8E%9F%E7%90%86/" style="background-size: cover; 
              background-position: center center;">
              <img class="lazyload lazyload placeholder" src="/medias/4.jpg" class="lazyload placeholder" data-srcset="/medias/4.jpg" srcset="https://img2.baidu.com/it/u=2037979560,2772131037&fm=26&fmt=auto&gp=0.jpg" alt="">
            </a>
          </div>
          <div class="post-content">
            01_基于redis和zookeeper的分布式锁实现原理1、面试题
一般实现分布式锁都有哪些方式？使用redis如何设计分布式锁？使用zk来设计分布式锁可以吗？这两种分布式锁的实现方式哪种效率比较高？
2、面试官心里分析
其实一般问问题，
          </div>
        </div>
        <div class="post-more">
          <a href="/2021/10/20/01redis%E5%92%8Czk%E9%94%81%E7%9A%84%E5%AE%9E%E7%8E%B0%E5%8E%9F%E7%90%86/">
            <i class="iconfont iconmore" pointer style="  " title="阅读更多"></i>
          </a>
        </div>
      </div>
      <div class="post-img">
        <a href="/2021/10/20/01redis%E5%92%8Czk%E9%94%81%E7%9A%84%E5%AE%9E%E7%8E%B0%E5%8E%9F%E7%90%86/" style="background-size: cover; 
          background-position: center center;">
          <img class="lazyload lazyload placeholder" src="/medias/4.jpg" class="lazyload placeholder" data-srcset="/medias/4.jpg" srcset="https://img2.baidu.com/it/u=2037979560,2772131037&fm=26&fmt=auto&gp=0.jpg" alt="">
        </a>
      </div>
    </article>
  
    
    <article class="post reveal" style="flex-direction: row-reverse;   ">
      <div class="post-main">
        <div class="post-info">
          <div class="post-time">
            <i class="fas fa-clock" aria-hidden="true"></i>
            <span class="post-time">2021-05-21</span>
          </div>
          <div class="post-title">
            <a class="post-title-link" href="/2021/05/21/hbase/">Hbase介绍及操作</a>
          </div>
          <div class="post-meta">
            <div class="post-tags">
              <!-- 文章详情页的标签 -->

    <i class="iconfont icontag"></i>
    <ul class="article-tag-list" itemprop="keywords"><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/Hbase/" rel="tag">Hbase</a></li><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/%E5%A4%A7%E6%95%B0%E6%8D%AE/" rel="tag">大数据</a></li></ul>

            </div>
            <div class="post-categories">
              <!-- 文章详情页的分类 -->

<div class="article-category">
  <i class="iconfont iconbookmark1"></i>
  <a class="article-category-link" href="/categories/%E5%A4%A7%E6%95%B0%E6%8D%AE/">大数据</a>
</div>


            </div>
          </div>
          <div class="post-img-mobile">
            <a href="/2021/05/21/hbase/" style="background-size: cover; 
              background-position: center center;">
              <img class="lazyload lazyload placeholder" src="/medias/10.jpg" class="lazyload placeholder" data-srcset="/medias/10.jpg" srcset="https://img2.baidu.com/it/u=2037979560,2772131037&fm=26&fmt=auto&gp=0.jpg" alt="">
            </a>
          </div>
          <div class="post-content">
            1. Hbase概述1.1 Hbase是什么
HBase是建立在HDFS之上的分布式面向列的数据库；属于KV结构数据，原生不支持标准SQL。它是一个Apache的开源项目，是横向扩展的。
HBase可以提供快速随机访问海量结构化数据。它利用
          </div>
        </div>
        <div class="post-more">
          <a href="/2021/05/21/hbase/">
            <i class="iconfont iconmore" pointer style="float: right;  " title="阅读更多"></i>
          </a>
        </div>
      </div>
      <div class="post-img">
        <a href="/2021/05/21/hbase/" style="background-size: cover; 
          background-position: center center;">
          <img class="lazyload lazyload placeholder" src="/medias/10.jpg" class="lazyload placeholder" data-srcset="/medias/10.jpg" srcset="https://img2.baidu.com/it/u=2037979560,2772131037&fm=26&fmt=auto&gp=0.jpg" alt="">
        </a>
      </div>
    </article>
  
    
    <article class="post reveal" style="   ">
      <div class="post-main">
        <div class="post-info">
          <div class="post-time">
            <i class="fas fa-clock" aria-hidden="true"></i>
            <span class="post-time">2021-05-21</span>
          </div>
          <div class="post-title">
            <a class="post-title-link" href="/2021/05/21/mybatis-plus%E6%80%BB%E7%BB%93/">mybatis-plus总结</a>
          </div>
          <div class="post-meta">
            <div class="post-tags">
              <!-- 文章详情页的标签 -->

    <i class="iconfont icontag"></i>
    <ul class="article-tag-list" itemprop="keywords"><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/lambda/" rel="tag">lambda</a></li><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/mybatis-plus/" rel="tag">mybatis-plus</a></li></ul>

            </div>
            <div class="post-categories">
              <!-- 文章详情页的分类 -->

<div class="article-category">
  <i class="iconfont iconbookmark1"></i>
  <a class="article-category-link" href="/categories/mybatis-plus/">mybatis-plus</a>
</div>


            </div>
          </div>
          <div class="post-img-mobile">
            <a href="/2021/05/21/mybatis-plus%E6%80%BB%E7%BB%93/" style="background-size: cover; 
              background-position: center center;">
              <img class="lazyload lazyload placeholder" src="/medias/9.jpg" class="lazyload placeholder" data-srcset="/medias/9.jpg" srcset="https://img2.baidu.com/it/u=2037979560,2772131037&fm=26&fmt=auto&gp=0.jpg" alt="">
            </a>
          </div>
          <div class="post-content">
            mybatis-plus自定义分页、SQL+wrapper一起使用12345678910111213141516171819202122232425262728293031323334   @Override    public Page&
          </div>
        </div>
        <div class="post-more">
          <a href="/2021/05/21/mybatis-plus%E6%80%BB%E7%BB%93/">
            <i class="iconfont iconmore" pointer style="  " title="阅读更多"></i>
          </a>
        </div>
      </div>
      <div class="post-img">
        <a href="/2021/05/21/mybatis-plus%E6%80%BB%E7%BB%93/" style="background-size: cover; 
          background-position: center center;">
          <img class="lazyload lazyload placeholder" src="/medias/9.jpg" class="lazyload placeholder" data-srcset="/medias/9.jpg" srcset="https://img2.baidu.com/it/u=2037979560,2772131037&fm=26&fmt=auto&gp=0.jpg" alt="">
        </a>
      </div>
    </article>
  
    
    <article class="post reveal" style="flex-direction: row-reverse;   ">
      <div class="post-main">
        <div class="post-info">
          <div class="post-time">
            <i class="fas fa-clock" aria-hidden="true"></i>
            <span class="post-time">2021-05-21</span>
          </div>
          <div class="post-title">
            <a class="post-title-link" href="/2021/05/21/%E5%9F%BA%E4%BA%8E%E5%8E%9F%E5%9E%8B%E6%A8%A1%E5%BC%8F%E5%92%8C%E4%BA%AB%E5%85%83%E6%A8%A1%E5%BC%8F%E5%AE%8C%E6%88%90%E4%B8%8D%E5%90%8C%E5%88%86%E5%B1%82POJO%E4%B9%8B%E9%97%B4%E7%9A%84%E6%95%B0%E6%8D%AE%E6%8B%B7%E8%B4%9D/">基于原型模式和享元模式完成不同分层POJO之间的数据拷贝</a>
          </div>
          <div class="post-meta">
            <div class="post-tags">
              <!-- 文章详情页的标签 -->

            </div>
            <div class="post-categories">
              <!-- 文章详情页的分类 -->

<div class="article-category">
  <i class="iconfont iconbookmark1"></i>
  <a class="article-category-link" href="/categories/%E8%AE%BE%E8%AE%A1%E6%A8%A1%E5%BC%8F/">设计模式</a>
</div>


            </div>
          </div>
          <div class="post-img-mobile">
            <a href="/2021/05/21/%E5%9F%BA%E4%BA%8E%E5%8E%9F%E5%9E%8B%E6%A8%A1%E5%BC%8F%E5%92%8C%E4%BA%AB%E5%85%83%E6%A8%A1%E5%BC%8F%E5%AE%8C%E6%88%90%E4%B8%8D%E5%90%8C%E5%88%86%E5%B1%82POJO%E4%B9%8B%E9%97%B4%E7%9A%84%E6%95%B0%E6%8D%AE%E6%8B%B7%E8%B4%9D/" style="background-size: cover; 
              background-position: center center;">
              <img class="lazyload lazyload placeholder" src="/medias/2.jpg" class="lazyload placeholder" data-srcset="/medias/2.jpg" srcset="https://img2.baidu.com/it/u=2037979560,2772131037&fm=26&fmt=auto&gp=0.jpg" alt="">
            </a>
          </div>
          <div class="post-content">
            享元模式
 享元
 享受，元数据
 同一个数据，我就认为是一个元数据，整个系统里这个数据就一份，缓存起来
 整个系统对这个数据，全部享受他一个对象实例即可
 直接既有内存来缓存一块数据，用享元模式

12345678910111213141
          </div>
        </div>
        <div class="post-more">
          <a href="/2021/05/21/%E5%9F%BA%E4%BA%8E%E5%8E%9F%E5%9E%8B%E6%A8%A1%E5%BC%8F%E5%92%8C%E4%BA%AB%E5%85%83%E6%A8%A1%E5%BC%8F%E5%AE%8C%E6%88%90%E4%B8%8D%E5%90%8C%E5%88%86%E5%B1%82POJO%E4%B9%8B%E9%97%B4%E7%9A%84%E6%95%B0%E6%8D%AE%E6%8B%B7%E8%B4%9D/">
            <i class="iconfont iconmore" pointer style="float: right;  " title="阅读更多"></i>
          </a>
        </div>
      </div>
      <div class="post-img">
        <a href="/2021/05/21/%E5%9F%BA%E4%BA%8E%E5%8E%9F%E5%9E%8B%E6%A8%A1%E5%BC%8F%E5%92%8C%E4%BA%AB%E5%85%83%E6%A8%A1%E5%BC%8F%E5%AE%8C%E6%88%90%E4%B8%8D%E5%90%8C%E5%88%86%E5%B1%82POJO%E4%B9%8B%E9%97%B4%E7%9A%84%E6%95%B0%E6%8D%AE%E6%8B%B7%E8%B4%9D/" style="background-size: cover; 
          background-position: center center;">
          <img class="lazyload lazyload placeholder" src="/medias/2.jpg" class="lazyload placeholder" data-srcset="/medias/2.jpg" srcset="https://img2.baidu.com/it/u=2037979560,2772131037&fm=26&fmt=auto&gp=0.jpg" alt="">
        </a>
      </div>
    </article>
  
    
    <article class="post reveal" style="   ">
      <div class="post-main">
        <div class="post-info">
          <div class="post-time">
            <i class="fas fa-clock" aria-hidden="true"></i>
            <span class="post-time">2021-05-21</span>
          </div>
          <div class="post-title">
            <a class="post-title-link" href="/2021/05/21/%E9%80%9A%E7%94%A8%E5%AF%BC%E5%85%A5/">通用导入</a>
          </div>
          <div class="post-meta">
            <div class="post-tags">
              <!-- 文章详情页的标签 -->

    <i class="iconfont icontag"></i>
    <ul class="article-tag-list" itemprop="keywords"><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/excel/" rel="tag">excel</a></li><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/hutool/" rel="tag">hutool</a></li></ul>

            </div>
            <div class="post-categories">
              <!-- 文章详情页的分类 -->

<div class="article-category">
  <i class="iconfont iconbookmark1"></i>
  <a class="article-category-link" href="/categories/%E5%AF%BC%E5%85%A5/">导入</a>
</div>


            </div>
          </div>
          <div class="post-img-mobile">
            <a href="/2021/05/21/%E9%80%9A%E7%94%A8%E5%AF%BC%E5%85%A5/" style="background-size: cover; 
              background-position: center center;">
              <img class="lazyload lazyload placeholder" src="/medias/13.jpg" class="lazyload placeholder" data-srcset="/medias/13.jpg" srcset="https://img2.baidu.com/it/u=2037979560,2772131037&fm=26&fmt=auto&gp=0.jpg" alt="">
            </a>
          </div>
          <div class="post-content">
            数据导入功能支持
读取excel、CSV
加入自定义注解校验数据防重
加入导入值跟实体类的类型检查
字典表支持(跟导出一个用法)
支持多种数据场景校验(Validation自带方法实体类校验)

使用方法123456789101112131
          </div>
        </div>
        <div class="post-more">
          <a href="/2021/05/21/%E9%80%9A%E7%94%A8%E5%AF%BC%E5%85%A5/">
            <i class="iconfont iconmore" pointer style="  " title="阅读更多"></i>
          </a>
        </div>
      </div>
      <div class="post-img">
        <a href="/2021/05/21/%E9%80%9A%E7%94%A8%E5%AF%BC%E5%85%A5/" style="background-size: cover; 
          background-position: center center;">
          <img class="lazyload lazyload placeholder" src="/medias/13.jpg" class="lazyload placeholder" data-srcset="/medias/13.jpg" srcset="https://img2.baidu.com/it/u=2037979560,2772131037&fm=26&fmt=auto&gp=0.jpg" alt="">
        </a>
      </div>
    </article>
  
    
    <article class="post reveal" style="flex-direction: row-reverse;   ">
      <div class="post-main">
        <div class="post-info">
          <div class="post-time">
            <i class="fas fa-clock" aria-hidden="true"></i>
            <span class="post-time">2021-05-20</span>
          </div>
          <div class="post-title">
            <a class="post-title-link" href="/2021/05/20/java8%20Stream%20%E4%BE%8B%E5%AD%90/">java8 Stream 例子</a>
          </div>
          <div class="post-meta">
            <div class="post-tags">
              <!-- 文章详情页的标签 -->

    <i class="iconfont icontag"></i>
    <ul class="article-tag-list" itemprop="keywords"><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/Stream/" rel="tag">Stream</a></li><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/encrypt/" rel="tag">encrypt</a></li><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/lambda/" rel="tag">lambda</a></li></ul>

            </div>
            <div class="post-categories">
              <!-- 文章详情页的分类 -->

<div class="article-category">
  <i class="iconfont iconbookmark1"></i>
  <a class="article-category-link" href="/categories/Stream/">Stream</a>
</div>


            </div>
          </div>
          <div class="post-img-mobile">
            <a href="/2021/05/20/java8%20Stream%20%E4%BE%8B%E5%AD%90/" style="background-size: cover; 
              background-position: center center;">
              <img class="lazyload lazyload placeholder" src="/medias/14.jpg" class="lazyload placeholder" data-srcset="/medias/14.jpg" srcset="https://img2.baidu.com/it/u=2037979560,2772131037&fm=26&fmt=auto&gp=0.jpg" alt="">
            </a>
          </div>
          <div class="post-content">
            数据123456List&lt;User&gt; userList = new ArrayList&lt;&gt;();userList.add(new User(1, &quot;aaa&quot;));userList.add(new 
          </div>
        </div>
        <div class="post-more">
          <a href="/2021/05/20/java8%20Stream%20%E4%BE%8B%E5%AD%90/">
            <i class="iconfont iconmore" pointer style="float: right;  " title="阅读更多"></i>
          </a>
        </div>
      </div>
      <div class="post-img">
        <a href="/2021/05/20/java8%20Stream%20%E4%BE%8B%E5%AD%90/" style="background-size: cover; 
          background-position: center center;">
          <img class="lazyload lazyload placeholder" src="/medias/14.jpg" class="lazyload placeholder" data-srcset="/medias/14.jpg" srcset="https://img2.baidu.com/it/u=2037979560,2772131037&fm=26&fmt=auto&gp=0.jpg" alt="">
        </a>
      </div>
    </article>
  
</section>
    <!-- 翻页 -->
    
  </div>

  
<aside id='l_side'>
  
    
      
        <section class="widget side_blogger">
  <div class='content'>
    
      
        <a class='avatar flat-box rectangle' href='/about/'>
          <img src='http://api.btstu.cn/sjtx/api.php?lx=c1&format=images'/>
        </a>
      
    
    
      <div class='text'>
        
          <h2>symkmk123 Blog</h2>
        
        
          <p>欢迎</p>

        
        
          <p><span id="jinrishici-sentence">symkmk123</span></p>
          <script src="https://sdk.jinrishici.com/v2/browser/jinrishici.js" charset="utf-8"></script>
        
      </div>
    
    
      <div class="social-wrapper">
        
          
            <a href="/atom.xml"
              class="social fas fa-rss flat-btn"
              target="_blank"
              rel="external nofollow noopener noreferrer">
              
            </a>
          
        
          
            <a href="mailto:me@xxx.com"
              class="social fas fa-envelope flat-btn"
              target="_blank"
              rel="external nofollow noopener noreferrer">
              
            </a>
          
        
          
            <a href="https://github.com/yuang01/hexo-theme-bamboo"
              class="social fab fa-github flat-btn"
              target="_blank"
              rel="external nofollow noopener noreferrer">
              
            </a>
          
        
          
            <a href="tencent://AddContact/?fromId=50&amp;fromSubId=1&amp;subcmd=all&amp;uin=你的qq号码"
              class="social fab fa-qq flat-btn"
              target="_blank"
              rel="external nofollow noopener noreferrer">
              
            </a>
          
        
      </div>
    
  </div>
</section>

      
    
  
  
  

  <div class="layout_sticky">
    
      
    <section class="widget side_category">
      
  <header>
    
      <a style="color: " href='/blog/categories/'><i class="fas fa-folder-open fa-fw" aria-hidden="true"></i><span class='name'>文章分类</span></a>
    
  </header>


      <div class='content'>
        <ul class="entry navigation">
          
            <li><a class="flat-box"
              title="/categories/Elasticsearch/" href="/categories/Elasticsearch/"
              id="categoriesElasticsearch"
              ><div class='name'>Elasticsearch</div><div class='badge'>(1)</div></a></li>
          
            <li><a class="flat-box"
              title="/categories/Stream/" href="/categories/Stream/"
              id="categoriesStream"
              ><div class='name'>Stream</div><div class='badge'>(1)</div></a></li>
          
            <li><a class="flat-box"
              title="/categories/mybatis-plus/" href="/categories/mybatis-plus/"
              id="categoriesmybatis-plus"
              ><div class='name'>mybatis-plus</div><div class='badge'>(1)</div></a></li>
          
            <li><a class="flat-box"
              title="/categories/redis/" href="/categories/redis/"
              id="categoriesredis"
              ><div class='name'>redis</div><div class='badge'>(1)</div></a></li>
          
            <li><a class="flat-box"
              title="/categories/%E5%88%86%E5%B8%83%E5%BC%8F%E9%94%81/" href="/categories/%E5%88%86%E5%B8%83%E5%BC%8F%E9%94%81/"
              id="categoriesE58886E5B883E5BC8FE99481"
              ><div class='name'>分布式锁</div><div class='badge'>(1)</div></a></li>
          
            <li><a class="flat-box"
              title="/categories/%E5%A4%9A%E7%BA%BF%E7%A8%8B/" href="/categories/%E5%A4%9A%E7%BA%BF%E7%A8%8B/"
              id="categoriesE5A49AE7BABFE7A88B"
              ><div class='name'>多线程</div><div class='badge'>(1)</div></a></li>
          
            <li><a class="flat-box"
              title="/categories/%E5%A4%A7%E6%95%B0%E6%8D%AE/" href="/categories/%E5%A4%A7%E6%95%B0%E6%8D%AE/"
              id="categoriesE5A4A7E695B0E68DAE"
              ><div class='name'>大数据</div><div class='badge'>(1)</div></a></li>
          
            <li><a class="flat-box"
              title="/categories/%E5%AF%BC%E5%85%A5/" href="/categories/%E5%AF%BC%E5%85%A5/"
              id="categoriesE5AFBCE585A5"
              ><div class='name'>导入</div><div class='badge'>(1)</div></a></li>
          
            <li><a class="flat-box"
              title="/categories/%E8%AE%BE%E8%AE%A1%E6%A8%A1%E5%BC%8F/" href="/categories/%E8%AE%BE%E8%AE%A1%E6%A8%A1%E5%BC%8F/"
              id="categoriesE8AEBEE8AEA1E6A8A1E5BC8F"
              ><div class='name'>设计模式</div><div class='badge'>(1)</div></a></li>
          
        </ul>
      </div>
    </section>
  
  
    
    
      
<section class="widget side_tagcloud">
    
  <header>
    
      <a style="color: " href='/tags/'><i class="fas fa-tags fa-fw" aria-hidden="true"></i><span class='name'>热门标签</span></a>
    
  </header>


    <div class='content'>
    <a href="/tags/CompletableFuture/" style="font-size: 14px; color: #999">CompletableFuture</a> <a href="/tags/CountDownLatch/" style="font-size: 14px; color: #999">CountDownLatch</a> <a href="/tags/Elasticsearch/" style="font-size: 14px; color: #999">Elasticsearch</a> <a href="/tags/Hbase/" style="font-size: 14px; color: #999">Hbase</a> <a href="/tags/Stream/" style="font-size: 14px; color: #999">Stream</a> <a href="/tags/encrypt/" style="font-size: 14px; color: #999">encrypt</a> <a href="/tags/excel/" style="font-size: 14px; color: #999">excel</a> <a href="/tags/hutool/" style="font-size: 14px; color: #999">hutool</a> <a href="/tags/lambda/" style="font-size: 24px; color: #555">lambda</a> <a href="/tags/mybatis-plus/" style="font-size: 14px; color: #999">mybatis-plus</a> <a href="/tags/redis/" style="font-size: 14px; color: #999">redis</a> <a href="/tags/%E5%88%86%E5%B8%83%E5%BC%8F%E9%94%81/" style="font-size: 24px; color: #555">分布式锁</a> <a href="/tags/%E5%A4%9A%E7%BA%BF%E7%A8%8B/" style="font-size: 14px; color: #999">多线程</a> <a href="/tags/%E5%A4%A7%E6%95%B0%E6%8D%AE/" style="font-size: 14px; color: #999">大数据</a>
    </div>
</section>

  
    
    
  <section class="widget side_recent_post">
    
  <header>
    
      <a style="color: " href='/tags/'><i class="fas fa-book fa-fw" aria-hidden="true"></i><span class='name'>最新文章</span></a>
    
  </header>


    <div class='content'>
      
      <!-- hash算法 -->
      
      <div class="aside-list">
        
          <div class="aside-list-item">
            
            
            

            <div class="post-img-box">
              <a href="/2022/02/14/Elasticsearch%E4%B8%ADScript%E7%94%A8%E6%B3%95%E4%BB%A3%E6%9B%BFsql%E4%B8%ADa%E5%B0%8F%E4%BA%8Eb%E6%9D%A1%E4%BB%B6/" class="post-img " style="background-size: cover; 
                background-position: center center;">
                <img class="lazyload lazyload placeholder" style="width:100%;height:100%;object-fit:cover;" data-src="/medias/1.jpg" class="lazyload placeholder" data-srcset="/medias/1.jpg" srcset="https://img2.baidu.com/it/u=2037979560,2772131037&fm=26&fmt=auto&gp=0.jpg" alt="">
              </a>
            </div>
            <div class="post-date-title">
              <div>
                
                  <span class="post-date">02-14</span>
                
              </div>
              <a class="post-title" href="/2022/02/14/Elasticsearch%E4%B8%ADScript%E7%94%A8%E6%B3%95%E4%BB%A3%E6%9B%BFsql%E4%B8%ADa%E5%B0%8F%E4%BA%8Eb%E6%9D%A1%E4%BB%B6/">Elasticsearch中Script用法代替sql中a小于b条件</a>
            </div>
          </div>
        
          <div class="aside-list-item">
            
            
            

            <div class="post-img-box">
              <a href="/2022/02/14/java%E5%A4%9A%E7%BA%BF%E7%A8%8B%E5%8A%A0%E9%80%9F%E9%81%8D%E5%8E%86%E8%A7%A3%E6%9E%90/" class="post-img " style="background-size: cover; 
                background-position: center center;">
                <img class="lazyload lazyload placeholder" style="width:100%;height:100%;object-fit:cover;" data-src="/medias/10.jpg" class="lazyload placeholder" data-srcset="/medias/10.jpg" srcset="https://img2.baidu.com/it/u=2037979560,2772131037&fm=26&fmt=auto&gp=0.jpg" alt="">
              </a>
            </div>
            <div class="post-date-title">
              <div>
                
                  <span class="post-date">02-14</span>
                
              </div>
              <a class="post-title" href="/2022/02/14/java%E5%A4%9A%E7%BA%BF%E7%A8%8B%E5%8A%A0%E9%80%9F%E9%81%8D%E5%8E%86%E8%A7%A3%E6%9E%90/">java多线程加速遍历解析</a>
            </div>
          </div>
        
          <div class="aside-list-item">
            
            
            

            <div class="post-img-box">
              <a href="/2021/10/20/02redis%E5%88%86%E5%B8%83%E5%BC%8F%E9%94%81%E5%88%86%E6%9E%90%E4%B8%8Ecluster%E6%A8%A1%E5%BC%8F%E6%90%AD%E5%BB%BA/" class="post-img " style="background-size: cover; 
                background-position: center center;">
                <img class="lazyload lazyload placeholder" style="width:100%;height:100%;object-fit:cover;" data-src="/medias/11.jpg" class="lazyload placeholder" data-srcset="/medias/11.jpg" srcset="https://img2.baidu.com/it/u=2037979560,2772131037&fm=26&fmt=auto&gp=0.jpg" alt="">
              </a>
            </div>
            <div class="post-date-title">
              <div>
                
                  <span class="post-date">10-20</span>
                
              </div>
              <a class="post-title" href="/2021/10/20/02redis%E5%88%86%E5%B8%83%E5%BC%8F%E9%94%81%E5%88%86%E6%9E%90%E4%B8%8Ecluster%E6%A8%A1%E5%BC%8F%E6%90%AD%E5%BB%BA/">02redis分布式锁分析与cluster模式搭建</a>
            </div>
          </div>
        
          <div class="aside-list-item">
            
            
            

            <div class="post-img-box">
              <a href="/2021/10/20/01redis%E5%92%8Czk%E9%94%81%E7%9A%84%E5%AE%9E%E7%8E%B0%E5%8E%9F%E7%90%86/" class="post-img " style="background-size: cover; 
                background-position: center center;">
                <img class="lazyload lazyload placeholder" style="width:100%;height:100%;object-fit:cover;" data-src="/medias/4.jpg" class="lazyload placeholder" data-srcset="/medias/4.jpg" srcset="https://img2.baidu.com/it/u=2037979560,2772131037&fm=26&fmt=auto&gp=0.jpg" alt="">
              </a>
            </div>
            <div class="post-date-title">
              <div>
                
                  <span class="post-date">10-20</span>
                
              </div>
              <a class="post-title" href="/2021/10/20/01redis%E5%92%8Czk%E9%94%81%E7%9A%84%E5%AE%9E%E7%8E%B0%E5%8E%9F%E7%90%86/">01redis和zk锁的实现原理</a>
            </div>
          </div>
        
          <div class="aside-list-item">
            
            
            

            <div class="post-img-box">
              <a href="/2021/05/21/hbase/" class="post-img " style="background-size: cover; 
                background-position: center center;">
                <img class="lazyload lazyload placeholder" style="width:100%;height:100%;object-fit:cover;" data-src="/medias/10.jpg" class="lazyload placeholder" data-srcset="/medias/10.jpg" srcset="https://img2.baidu.com/it/u=2037979560,2772131037&fm=26&fmt=auto&gp=0.jpg" alt="">
              </a>
            </div>
            <div class="post-date-title">
              <div>
                
                  <span class="post-date">05-21</span>
                
              </div>
              <a class="post-title" href="/2021/05/21/hbase/">Hbase介绍及操作</a>
            </div>
          </div>
        
      </div>
    </div>
  </section>

    
  <section class="widget side_archives">
    
    <header><a style="color: red" href='/archives/'><i class="fas fa-archive fa-fw" aria-hidden="true"></i><span class='name'>归档</span></a></header><div class="content"><ul class="card-archive-list"><li class="card-archive-list-item"><a class="card-archive-list-link" href="/archives/2022/02/"><span class="card-archive-list-date">二月 2022</span><span class="card-archive-list-count">2</span></a></li><li class="card-archive-list-item"><a class="card-archive-list-link" href="/archives/2021/10/"><span class="card-archive-list-date">十月 2021</span><span class="card-archive-list-count">2</span></a></li><li class="card-archive-list-item"><a class="card-archive-list-link" href="/archives/2021/05/"><span class="card-archive-list-date">五月 2021</span><span class="card-archive-list-count">5</span></a></li></ul></div>
  </section>

    <section class="widget side_webinfo">
  
  <header>
    
      <i style="color: " class="fas fa-chart-line fa-fw" aria-hidden="true"></i><span class='name'>站点信息</span>
    
  </header>


  <div class='content'>
    <div class="webinfo">
      
        <div class="webinfo-item">
          <div>文章数目：</div>
          <div>9 篇</div>
        </div>
      

      
        <div class="webinfo-item">
          <div>已运行时间：</div>
          <div id="webinfo-runtime-count" publish_date="03/24/2020 21:34:09"></div>
        </div>
        <script>
          var BirthDay = new Date(new Date('2020/01/01'));
          var today = new Date();
          var timeold = (today.getTime() - BirthDay.getTime());
          var daysold = Math.floor(timeold / (24 * 60 * 60 * 1000));
          document.getElementById('webinfo-runtime-count').innerHTML = daysold + ' 天';
        </script>
      


      
        <div class="webinfo-item">
          <div>本站总字数：</div>
          <div>17.2k 字</div>
        </div>
      

      
        <div class="webinfo-item">
          <div>本站访客数：</div>
          
          <div><span id="busuanzi_value_site_uv"><i class="fas fa-fan fa-spin fa-fw" aria-hidden="true"></i></span> 人</div>
          
        </div>
      

      
        <div class="webinfo-item">
          <div>本站总访问量：</div>
          
          <div><span id="busuanzi_value_site_pv"><i class="fas fa-fan fa-spin fa-fw" aria-hidden="true"></i></span> 次</div>
          
        </div>
      

      
        <div class="webinfo-item">
          <div>最后活动时间：</div>
          
            <div id="last-update" style="display: none;">Thu May 12 2022 17:13:52 GMT+0800 (中国标准时间)</div>
            <div id="last-update-show">2022-05-12 日</div>
          
        </div>
        
        <script>
          function timeago(dateTimeStamp) {
              var minute = 1000 * 60; //把分，时，天，周，半个月，一个月用毫秒表示
              var hour = minute * 60;
              var day = hour * 24;
              var week = day * 7;
              var month = day * 30;
              var now = new Date().getTime(); //获取当前时间毫秒
              var diffValue = now - dateTimeStamp; //时间差
              if (diffValue < 0) {
                  return;
              }
              var minC = diffValue / minute; //计算时间差的分，时，天，周，月
              var hourC = diffValue / hour;
              var dayC = diffValue / day;
              var weekC = diffValue / week;
              var monthC = diffValue / month;
              if (monthC >= 1 && monthC <= 3) {
                  result = " " + parseInt(monthC) + " 月前"
              } else if (weekC >= 1 && weekC <= 3) {
                  result = " " + parseInt(weekC) + " 周前"
              } else if (dayC >= 1 && dayC <= 6) {
                  result = " " + parseInt(dayC) + " 天前"
              } else if (hourC >= 1 && hourC <= 23) {
                  result = " " + parseInt(hourC) + " 小时前"
              } else if (minC >= 1 && minC <= 59) {
                  result = " " + parseInt(minC) + " 分钟前"
              } else if (diffValue >= 0 && diffValue <= minute) {
                  result = "刚刚"
              } else {
                  var datetime = new Date();
                  datetime.setTime(dateTimeStamp);
                  var Nyear = datetime.getFullYear();
                  var Nmonth = datetime.getMonth() + 1 < 10 ? "0" + (datetime.getMonth() + 1) : datetime.getMonth() + 1;
                  var Ndate = datetime.getDate() < 10 ? "0" + datetime.getDate() : datetime.getDate();
                  var Nhour = datetime.getHours() < 10 ? "0" + datetime.getHours() : datetime.getHours();
                  var Nminute = datetime.getMinutes() < 10 ? "0" + datetime.getMinutes() : datetime.getMinutes();
                  var Nsecond = datetime.getSeconds() < 10 ? "0" + datetime.getSeconds() : datetime.getSeconds();
                  result = Nyear + "-" + Nmonth + "-" + Ndate
              }
              return result;
          }
          var lastUpDate = document.getElementById('last-update').innerHTML;
          try {
            document.getElementById('last-update-show').innerHTML = timeago(new Date(lastUpDate));
          } catch (error) {
            document.getElementById('last-update-show').innerHTML = '2022-05-12 日';
          }
        </script>
        
      
    </div>
  </div>
</section>
    
  </div>
</aside>

</div>
<!-- 花瓣和雪花飘落 -->
<!-- 雪花和花瓣特效 -->



<!-- 灯笼 -->


      </main>
    </div>

    <!-- 页脚 -->
    
  
  <div class="footer bg-color">
    <div class="footer-main">
      
        
          <div class="link">
            
          </div>
        
      
        
          <div class="footer-copyright">
            <p>Copyright © 2019 - 2020 <a target="_blank" rel="noopener" href="https://github.com/yuang01">yuang01</a> | Powered by <a target="_blank" rel="noopener" href="https://hexo.io/zh-cn/docs/">Hexo</a> | Theme <a target="_blank" rel="noopener" href="https://github.com/yuang01/theme">Bamboo</a> </p>

          </div>
        
      
        
          
            <!-- 不蒜子统计 -->
            <!-- 不蒜子统计 -->
<span id="busuanzi_container_site_pv">
      <i class="fas fa-eye" aria-hidden="true"></i>本站总访问量：<span id="busuanzi_value_site_pv"></span> 次
</span>
<span class="post-meta-divider">|</span>
<span id="busuanzi_container_site_uv" style='display:none'>
      <i class="fas fa-users" aria-hidden="true"></i>本站访客数：<span id="busuanzi_value_site_uv"></span> 人
</span>

          
        
      
        
          <div class="footer-custom">
            
          </div>
        
      
    </div>
  </div>



    <!-- 渲染暗黑按钮 -->
    
      <div class="dark">
  <div class="dark-content">
    <i class="fas fa-moon" aria-hidden="true"></i>
    <!-- <span>关灯</span> -->
  </div>
  
</div>

<script>
  $(function() {
    let isDark = JSON.parse(localStorage.getItem('dark'))  || JSON.parse('false');
    if (isDark) {
      $(".dark-content").replaceWith(
          `
          <div class='dark-content'>
            <i class="fas fa-lightbulb" aria-hidden="true"></i>
          </div>
          `
        );
    }
    $('.dark').click(function() {
      if ($(document.body).is('.darkModel')) {
        $(document.body).removeClass('darkModel');
        localStorage.setItem('dark', false);
        $(".dark-content").replaceWith(
          `
          <div class='dark-content'>
            <i class="fas fa-moon" aria-hidden="true"></i>
          </div>
          `
        );
      } else {
        $(document.body).addClass('darkModel');
        localStorage.setItem('dark', true);
        $(".dark-content").replaceWith(
          `
          <div class='dark-content'>
            <i class="fas fa-lightbulb" aria-hidden="true"></i>
          </div>
          `
        );
      }
    })
  })
</script>
    
    <!-- 渲染回到顶部按钮 -->
    
      <div class="goTop top-btn-color" pointer>
  <i class="fas fa-arrow-up" aria-hidden="true"></i>
</div>
<script src="/js/goTop.js"></script>

    
    <!-- 渲染左下角音乐播放器 -->
    

    <!-- 图片放大 -->
    
      <script src="/js/fancybox/jquery.fancybox.min.js"></script>
    

    <!-- 百度解析 -->
    <!-- Baidu Analytics -->

    <!-- Baidu Push -->

<script>
    (function () {
        var bp = document.createElement('script');
        var curProtocol = window.location.protocol.split(':')[0];
        if (curProtocol === 'https') {
            bp.src = 'https://zz.bdstatic.com/linksubmit/push.js';
        } else {
            bp.src = 'http://push.zhanzhang.baidu.com/push.js';
        }
        var s = document.getElementsByTagName("script")[0];
        s.parentNode.insertBefore(bp, s);
    })();
</script>

    
    <!-- 背景彩带 -->
    
      <script type="text/javascript" size="100" alpha='0.4' zIndex="-1" src="/js/ribbon.min.js"></script>
    

    <script src="/js/utils/index.js"></script>
    <script src="/js/app.js" data-pjax></script>
    
    <!-- 文章目录所需js -->
<link href="/js/tocbot/tocbot.css" rel="stylesheet">
<script src="/js/tocbot/tocbot.min.js"></script>

<script>
  var headerEl = 'h1,h2, h3, h4',  //headers 
    content = '.post-detail',//文章容器
    idArr = {};  //标题数组以确定是否增加索引id
  //add #id
  var option = {
    // Where to render the table of contents.
    tocSelector: '.toc',
    // Where to grab the headings to build the table of contents.
    contentSelector: content,
    // Which headings to grab inside of the contentSelector element.
    headingSelector: headerEl,
    scrollSmooth: true,
    scrollSmoothOffset: -80,
    headingsOffset: -($(window).height() * 0.4 - 45),
    positionFixedSelector: '.toc-main',
    positionFixedClass: 'is-position-fixed',
    fixedSidebarOffset: 'auto',
    activeLinkClass: 'is-active-link',
    // onClick: function (e) {},
  }
  if ($('.toc').length > 0) {

    $(content).children(headerEl).each(function () {
      //去除空格以及多余标点
      var headerId = $(this).text().replace(/[\s|\~|`|\!|\@|\#|\$|\%|\^|\&|\*|\(|\)|\_|\+|\=|\||\|\[|\]|\{|\}|\;|\:|\"|\'|\,|\<|\.|\>|\/|\?|\：|\，|\。]/g, '');

      headerId = headerId.toLowerCase();
      if (idArr[headerId]) {
        //id已经存在
        $(this).attr('id', headerId + '-' + idArr[headerId]);
        idArr[headerId]++;
      }
      else {
        //id未存在
        idArr[headerId] = 1;
        $(this).attr('id', headerId);
      }
    });

    document.addEventListener("DOMContentLoaded", function () {
      tocbot.init(option);
      mobileTocClick();
    });

  }

  window.tocScrollFn = function () {
    return bamboo.throttle(function () {
      findHeadPosition();
    }, 100)()
  }
  window.addEventListener('scroll', tocScrollFn);

  const findHeadPosition = function (top) {
    if ($('.toc-list').length <= 0) {
      return false;
    }
    setTimeout(() => {  // or DOMContentLoaded 
      autoScrollToc();
    }, 0);
  }

  const autoScrollToc = function () {
    const $activeItem = document.querySelector('.is-active-link');
    const $cardToc = document.querySelector('.toc-content');
    const activePosition = $activeItem.getBoundingClientRect().top
    const sidebarScrollTop = $cardToc.scrollTop
    if (activePosition > (document.documentElement.clientHeight - 100)) {
      $cardToc.scrollTop = sidebarScrollTop + 150
    }
    if (activePosition < 100) {
      $cardToc.scrollTop = sidebarScrollTop - 150
    }
  }

  document.addEventListener('pjax:send', function () {
    if ($('.toc').length) {
      tocbot.destroy();
    }
  });

  document.addEventListener('pjax:complete', function () {
    if ($('.toc').length) {
      tocbot.init(option);
      mobileTocClick();
    }
  });
  
  // 手机端toc按钮点击出现目录
  const mobileTocClick = function () {
    const $cardTocLayout = document.getElementsByClassName('toc-aside')[0];
    const $cardToc = $cardTocLayout.getElementsByClassName('toc-content')[0];
    let right = '45px';
    if (window.innerWidth >= 551 && window.innerWidth <= 992) {
      right = '100px'
    }
    const mobileToc = {
      open: () => {
        $cardTocLayout.style.cssText = 'animation: toc-open .3s; opacity: 1; right: ' + right
      },

      close: () => {
        $cardTocLayout.style.animation = 'toc-close .2s'
        setTimeout(() => {
          $cardTocLayout.style.cssText = "opacity:''; animation: ''; right: ''"
        }, 100)
      }
    }
    document.getElementById('toc-mobile-btn').addEventListener('click', () => {
      if (window.getComputedStyle($cardTocLayout).getPropertyValue('opacity') === '0') mobileToc.open()
      else mobileToc.close()
    })

    $cardToc.addEventListener('click', (e) => {
      if (window.innerWidth < 992) { // 小于992px的时候
        mobileToc.close()
      }
    })
  }
</script>

<style>
  .is-position-fixed {
    position: sticky !important;
    top: 74px;
  }

  .toc-main ul {
    counter-reset: show-list;
  }

  .toc-main ul li::before {
    content: counter(item)".";
    display: block;
    position: absolute;
    left: 12px;
    top: 0;
  }
</style> 

<!-- 渲染issues标签里的内容 -->
<script>
  function loadIssuesJS() {
    if ($(".post-detail").find(".issues-api").length == 0) {
      return;
    } 
    loadScript('/js/issues/index.js');
  };
  $(function () {
    loadIssuesJS();
  });
  document.addEventListener('pjax:complete', function () {
    if (typeof IssuesAPI == "undefined") {
      loadIssuesJS();
    }
  })
</script>

<!-- 输入框打字特效 -->
<!-- 输入框打字特效 -->

  <script src="/js/activate-power-mode.js"></script>
  <script>
    POWERMODE.colorful = true;  // 打开随机颜色特效
    POWERMODE.shake = false;    // 关闭输入框抖动
    document.body.addEventListener('input', POWERMODE);//监听打字事件
  </script>


<!-- markdown代码一键复制功能 -->

  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/v-plugs-ayu/lib/ayu.css">
  <script src="https://cdn.jsdelivr.net/npm/v-plugs-ayu/lib/ayu.umd.min.js"></script>
  <script src="/js/clipboard/clipboard.min.js"></script>
  <div id="appCopy">
  </div>
  <script data-pjax>
    var vm = new Vue({
      el: '#appCopy',
      data: {
      },
      computed: {
      },
      mounted() {
        const that = this;
        var copy = '复制';
        /* code */
        var initCopyCode = function () {
          var copyHtml = '';
          copyHtml += '<button class="btn-copy" data-clipboard-snippet="" style="position:absolute;top:0;right:0;z-index:1;">';
          copyHtml += '<i class="fas fa-copy"></i><span>' + copy + '</span>';
          copyHtml += '</button>';
          $(".post-detail pre").not('.gutter pre').wrap("<div class='codeBox' style='position:relative;width:100%;'></div>")
          $(".post-detail pre").not('.gutter pre').before(copyHtml);
          new ClipboardJS('.btn-copy', {
            target: function (trigger) {
              return trigger.nextElementSibling;
            }
          });
        }
        initCopyCode();
        $('.btn-copy').unbind('click').bind('click', function () {
          doSomething();
        })
        $(document).unbind('keypress').bind('keypress', function (e) {
          if (e.ctrlKey && e.keyCode == 67) {
            doSomething();
          }
        })

        function doSomething() {
          that.$notify({
            title: "成功",
            content: "代码已复制，请遵守相关授权协议。",
            type: 'success'
          })
        }
      },
      methods: {
      },
      created() { }
    })
  </script>
  

<!-- 图片懒加载 -->
<script defer src="https://cdn.jsdelivr.net/npm/vanilla-lazyload@17.1.0/dist/lazyload.min.js"></script>
<script>
  // https://www.npmjs.com/package/vanilla-lazyload
  // Set the options globally
  // to make LazyLoad self-initialize
  window.lazyLoadOptions = {
    elements_selector: ".lazyload",
    threshold: 0
  };
  // Listen to the initialization event
  // and get the instance of LazyLoad
  window.addEventListener(
    "LazyLoad::Initialized",
    function (event) {
      window.lazyLoadInstance = event.detail.instance;
    },
    false
  );
  document.addEventListener('DOMContentLoaded', function () {
    lazyLoadInstance.update();
  });
  document.addEventListener('pjax:complete', function () {
    lazyLoadInstance.update();
  });
</script>


<!-- 卡片滚动动画 -->
   

<!-- 评论所需js -->

  
    <script type="text/javascript">
  var utteranceCommon = {};

  function check_utterance() {
    let isDark = JSON.parse(localStorage.getItem('dark')) || JSON.parse('false');
    if (isDark) {
      utteranceCommon.Theme = 'github-dark';
    } else {
      utteranceCommon.Theme = 'github-light';
    }

    return document.getElementById("gitment-container");
  }
  comment_el = '#gitment-container';
  load_utterance = function () {
    if ($(comment_el).length) {
      // 匿名函数，防止污染全局变量
      const HEAD = check_utterance();

      var utterances = document.createElement('script');
      utterances.type = 'text/javascript';
      utterances.async = true;
      utterances.setAttribute('issue-term', 'pathname')
      utterances.setAttribute('theme', utteranceCommon.Theme)
      utterances.setAttribute('repo', '')
      utterances.crossorigin = 'anonymous';
      utterances.src = 'https://utteranc.es/client.js';
      // content 是要插入评论的地方
      document.getElementById('gitment-container').appendChild(utterances);

    }
  }

  function dark_utterance() {
    const HEAD = check_utterance();
    if (!HEAD) return;
    const message = {
      type: 'set-theme',
      theme: utteranceCommon.Theme
    };
    const utteranceIframe = document.querySelector('iframe');
    utteranceIframe.contentWindow.postMessage(message, 'https://utteranc.es');
  }

  $(document).ready(load_utterance);
  document.addEventListener('pjax:complete', function () {
    load_utterance();
  });

  $('.dark').click(function () {
    setTimeout(() => {
      dark_utterance();
    });
  })

</script>

<style>
  .utterances {
    max-width: inherit !important;
  }
</style>
  


<!-- 鼠标点击特效 -->
<!-- 爱心点击 -->

  
    <script src="/js/cursor/text.js"></script>
  




  <script async src="//busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js" data-pjax></script>


    <!-- pjax -->
    

<!-- pjax -->


  <script src="/js/pjax@0.2.8/index.js"></script>
  
    <!-- 样式位于：source/css/_third-party/pjaxanimate.styl -->

<div class="pjax-animate">
  
    <div class="loading-circle"><div id="loader-circle"></div></div>
    <script>
      window.ShowLoading = function() {
        $(".loading-circle").css("display", "block");
      };
      window.HideLoading = function() {
        $(".loading-circle").css("display", "none");
      }
    </script>
  
	<script>
    document.addEventListener('pjax:complete', function () {
      window.HideLoading();
    })
    document.addEventListener('pjax:send', function () {
      window.ShowLoading();
    })
    document.addEventListener('pjax:error', function () {
      window.HideLoading();
    })
	</script>
</div>

  

  <script>
    var pjax = new Pjax({
      elements: 'a[href]:not([href^="#"]):not([href="javascript:void(0)"]):not([no-pjax])',   // 拦截正常带链接的 a 标签
      selectors: ["#pjax-container","title"],                                   // 根据实际需要确认重载区域
      cacheBust: false,   // url 地址追加时间戳，用以避免浏览器缓存
      timeout: 5000
    });

    document.addEventListener('pjax:send', function (e) {

      try {
        var currentUrl = window.location.pathname;
        var targetUrl = e.triggerElement.href;
        var banUrl = [""];
        if (banUrl[0] != "") {
          banUrl.forEach(item => {
            if(currentUrl.indexOf(item) != -1 || targetUrl.indexOf(item) != -1) {
              window.location.href = targetUrl;
            }
          });
        }
      } catch (error) {}

      $(window).unbind('resize');
      $(window).unbind('scroll');
      $(document).unbind('scroll');
      $(document).unbind('click');
      $('body').unbind('click');

    })
    
    document.addEventListener('pjax:complete', function () {
      $('script[data-pjax], .pjax-reload script').each(function () {
        $(this).parent().append($(this).remove());
      });
    });

    document.addEventListener('pjax:error', function (e) {
      window.location.href = e.triggerElement.href;
    })
    
    // 刷新不从顶部开始
    document.addEventListener("DOMContentLoaded", function () {
      history.scrollRestoration = 'auto';
    })
  </script>



  </body>
</html>